<template>
	<view class="tabsContainer">
		<view class="tabsTitle" v-for="(item,index) in tabs" :data-index="index" :key="item.id">
			<view :class=" [ item.isActive ? 'active' : '' ]">
				{{item.value}}
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		props:{
			"tabs":{
				type:Array,
				value:[]
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	.tabsContainer{
		display: flex;
		background-color: #fff;
		// margin-top: 20upx;
		// width: 96%;
		overflow: hidden;
		border-radius: 0 0 16upx 16upx;
		.tabsTitle{
			display: flex;
			justify-content: center;
			align-items: center;
			flex: 1;
			padding: 15rpx 0;
			
			.active{
				color:#8253fb;
				border-bottom: 5upx solid red;
			}
		}
		
		
	}
</style>
